<template>
  <div id="openidUserInfo">
    <h1 class="con-right-title">
      OpenID-AB用户查询
    </h1>
    <!-- 搜索 -->
    <top-search @toSearch="toSearch"></top-search>
    <!-- 按钮 -->
    <div class="table-conBtn">
      <freshCom @searchList="searchList"></freshCom>
    </div>
    <!-- 表格部分 -->
    <el-table v-loading="loading" :data="tableData">
      <el-table-column label="编号" type="index" width="120" align="center">
      </el-table-column>
      <el-table-column
        label="OpenID"
        prop="openId"
        min-width="100"
        align="center"
      >
      </el-table-column>
      <el-table-column
        label="手机号"
        prop="phone"
        min-width="100"
        align="center"
      >
      </el-table-column>
      <el-table-column label="学院" min-width="100" align="center">
        <template slot-scope="{ row }">
          <span>{{ row.collegeName || '——' }}</span>
        </template>
      </el-table-column>
      <el-table-column
        label="参加活动时间"
        prop="createTime"
        min-width="100"
        align="center"
      >
      </el-table-column>
      <el-table-column
        label="活动公众号"
        prop="appName"
        min-width="100"
        align="center"
      >
      </el-table-column>
      <el-table-column label="AB属性" min-width="100" align="center">
        <template slot-scope="{ row }">
          <span>{{ row.userType }}用户</span>
        </template>
      </el-table-column>
    </el-table>
    <!-- 分页器 -->
    <pageCom
      :searchParams="searchParams"
      :total="total"
      @searchList="searchList"
    ></pageCom>
  </div>
</template>

<script>
import topSearch from './topSearch'
import { openidUserInfoList } from '@/api/openIdRelationAB/openidUserInfo'
export default {
  components: {
    topSearch
  },
  data() {
    return {
      loading: false,
      tableData: [],
      total: 0,
      searchParams: {
        pageNum: 1,
        pageSize: 10
      }
    }
  },
  mounted() {
    this.searchList()
  },
  methods: {
    searchList() {
      openidUserInfoList(this.searchParams, (res) => {
        this.tableData = res.rows
        this.total = res.total
      })
    },
    toSearch(val) {
      this.searchParams.pageNum = 1
      Object.assign(this.searchParams, val)
      this.searchList()
    }
  }
}
</script>
<style lang="less" scoped></style>
